<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/commons.css" />
</head>
<body style="margin: 0">
    <div style="height: 48px;background-color: #dddddd"></div>
    <div>
        <form action="/home" method="post">
            <input type="text" name="username" placeholder="用户名" />
            <input type="text" name="email"  placeholder="邮箱"/>
            <input type="text" name="gender"  placeholder="性别"/>
            <input type="submit" value="添加" />
        </form>
    </div>
    <div>
        <table>
            {% for row in user_list %}
                <tr>
                    <td>{{ row.username }}</td>
                    <td>{{ row.gender }}</td>
                    <td>{{ row.email }}</td>
                    <td>
{#                        <a href="/detail?nid={{ row.id }}">查看详细</a> |#}
                        <a href="/cmdb/detail-{{ row.id }}.html">查看详细</a> |
                        <a class="del" href="#" row-id="{{ row.id }}">删除</a>
                    </td>
                </tr>
            {% endfor %}
        </table>
    </div>

    <div>
        <form action="/del_host" method="post">
            <input style="display: none" id="nid" type="text" name="nid" />
            <p>
                <input type="submit" />
                <input type="botton" />
            </p>
        </form>
    </div>

<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.12.4.min.js"></script>
<script>
    $('.del').click(function(){
        const row_id = $(this).attr('row-id');
        $(this).parent().parent().remove();
        //alert(row_id);
        $('#nid').val(row_id)
    })
</script>
</body>
</html>